<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>cssDemo1</title>
    <!--内部样式-->
    <!-- <style>
        div {
            font-size: 100px;
            color: green;
        }
    </style> -->
    <!--外部样式-->
    <!-- <link rel="stylesheet" href="style.css"> -->
</head>
<body>
    <!-- <div class="three">
        <h3>这是一个标题</h3>
           hello 万兰新
    </div> -->
    <!-- <div class="one">hello</div>
    <div class="two">这是一个文本</div>
    <div class="three">嘿嘿嘿</div> -->
    <div class="four">呜呼</div>
    <!-- <div class="two">万兰新是勺</div>
    <div style="font-size: 100px; color:blue;">勺是万兰新</div> -->

    <style>
         .four {
            color: black;
            background-color: rgb(230,131, 110);
            width: 300px;
            height: 300px;
            border-radius: 150px;
          }
        .three {
            font-size: 100px;
            width: 2000px;
            height: 1400px;
            background-color: rgb(130, 150, 240);
            background-image: url(cat.png);
            /* 默认是“平铺” */
            background-repeat: no-repeat;
            /* 设置背景的位置,第一个center上下居中，第二个center左右居中 */
            background-position: center center;
            background-size: 2000px 1400px;
          
        } 
        /*字体相关的*/
        .one {
            /* 默认是微软雅黑 */
          font-family: '宋体';
          font-size: 100px;
          /* 描述字体的粗细程度 */
          font-weight: 200; 

          font-style: italic;
        }
        /* 文本相关的 */
        .two {
            font-size: 100px;
            color: rgb(230,131, 110);
            /* 文本对齐，左对齐（left）,右对齐（right），居中（center） */
            text-align: center;
            /* 文本装饰，加下划线啥的 */
            /* none 可以把有下划线的去掉，典型的就是a标签 */ 
            text-decoration: underline;
            /* 文本缩进 */
            text-indent: 100px;
            /* 行高（行间距） */
            line-height: 100px;
             /* 设置背景颜色 */
           
         }
         
        /* .one {
           color: yellow;
           font-size: 100px;
        }
        .two {
            color: aqua;
            font-size: 100px;
        }
        .three  h3{
             color: chartreuse;
             font-size: 150px;
        } */
    </style>
</body>
</html>